<!DOCTYPE html>
<html>
<head>
<#include "/common/common.ftl" parse=true encoding="utf-8">
<style>
.body_content {
	width: 100%;
}

.row {
	padding-right: 0px;
	margin-right: 0px;
}

.email-logo {
	margin-bottom: 30px;
	text-align: center;
}

.col-md-10 {
	margin: auto;
}

.contentWrapper {
	margin-top: 90px;
	text-align: center;
}

.contentWrapper .message {
	font-size: 18px;
	margin-top: 10px;
}

.contentWrapper .message div {
	text-align: left;
	margin: 0 auto;
}

.contentWrapper .message p {
	text-indent: 2em;
	text-align: left;
}

.contentWrapperLogo {
	margin-bottom: 40px;
	font-size: 40px;
}

.ion-email-unread {
	color: #00377a;
	font-size: 40px;
}

.message1 {
	margin-top:40px;
	text-align: left;
	font-size: 15px;
}

.message2 {
	text-align: left;
	color: #999;
}

.message3 {
	height: 50px;
	float: left;
	text-align: left;
	color: #999;
}

#timer {
	width: 130px;
	float: left;
}

#timer a {
	display: block;
	width: 110px;
	background-color: #81BDDC;
    color: #fff;
    border-radius: 10px;
    margin-left: 10px;
}

#timer a:hover{
	background-color: #69AFD6;
}

.message3 a:hover {
	color: red;
}

.ion-help-circled {
	color: red;
	font-size: 30px;
}

.timeSpan {
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	font-size: 18px;
}

.content-header {
	margin-left: 50px;
	margin-top: 20px;
}

#timeSpan {
	color: #FF4900;
	font-size: 15px;
}
</style>
</head>
<body>
	<#include "/common/header.ftl" parse=true encoding="utf-8">

	<div class="container body_content">
		<div class="row">
			<div class="col-md-12">
				<input type="hidden" id="hidTime" runat="server" value="0" />
				<div class="contentWrapper form-horizontal">
					<p class="contentWrapperLogo" style="">
						<img width="80px;" src="${base}/styles/images/common/Success.png">账户已注册成功，请激活账户
					</p>
					<div>
						<div class="message col-md-offset-2 col-md-8"> <!-- <i class="ion-email-unread"></i> -->
							<div>亲爱的 ${Session.username!}：</div>
							<p>您好。欢迎来到前星学院，恭喜您已注册成功。</p>
							<p>系统已自动发送一封账户激活邮件至您的邮箱&nbsp${Session.member.email!}，请查看您的邮箱，点击其中的链接进行账户激活。
							<p>（注意：账户成功激活后，才能使用更多的功能）</p>
						</div>
						<div class="col-md-offset-2 col-md-8" style="margin-bottom: 100px;">
						<p class="message1 form-group col-md-12">
							<i class="ion-help-circled"></i> <span>没收到邮件?</span>
						</p>
						<p class="message2 form-group col-md-12">1.查看邮箱的垃圾箱或广告箱，邮件可能被误认为垃圾邮件。</p>
						<div class="message3">2.如若还是没有找到邮件或连接已过期，可点击</div>
						<div id="timer"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	<#include "/common/footer.ftl" parse=true encoding="utf-8">
	<script type="text/javascript">
		var maxtime;
		if (window.name == '') {
			maxtime = 0;
			$("#timer").html('<a onclick="CountDown()">免费发送邮件</a>');
		} else {
			maxtime = window.name;
			if (maxtime > 0) {
				msg = "重新发送（" + maxtime + "秒）";
				$("#timer").html(msg);
				timer = setInterval("onCountDown()", 1000);
			} else {
				$("#timer").html('<a onclick="CountDown()">免费发送邮件</a>');
			}
		}
		function CountDown() {
			maxtime = 60;
			window.name = 60;
			onCountDown();

			var url = '${base}/auth/resendMailAction.json';
			var entity = {
					type: 1
			};
			var onloadFunc = function(result) {
				bootbox.setLocale("zh_CN");
				if (result.isSuccess === true) {
					bootbox.alert("邮件已发送，请注意查收！", function(result) {

					});
				} else {
					bootbox.alert(result.message, function(result) {
						$("#timer").html('<a onclick="CountDown()">免费发送邮件</a>');
					});
				}
			}
			httpRequestPostJson(url, entity, true, onloadFunc);

			timer = setInterval("onCountDown()", 1000);
		}

		function onCountDown() {
			if (maxtime > 0) {
				msg = "重新发送（" + maxtime + "秒）";
				$("#timer").html(msg);
				--maxtime;
				window.name = maxtime;
			} else {
				clearInterval(timer);
				$("#timer").html('<a onclick="CountDown()">免费发送邮件</a>');

			}
		}
	</script>
</body>
</html>